<!doctype html>
 
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Resizable - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <link rel="stylesheet" href="../CSS/m-110-120.css" type="text/css" />
  <style>
  .map{
		position:absolute;
		width:100%; 
		height:100%; 
		overflow:hidden;
		margin:0;
		border-top:1px solid black;
		background: url(../images/map_bg.png) no-repeat;
}
 .slidebottom { position:absolute;
    	top:299px;/*top:467px;*/
    	left:26px;/*left:326px;*/
    	width:1130px;
    	overflow:hidden;
    	background:transparent;
    	color: black;
    	margin-right:0px;
    	height:250px;
    	background:yellow;}
  #resizable h3 { text-align: center; margin: 0; background:red;}
  </style>
  <script>
  $(function() {
    $( ".slidebottom" ).resizable({ handles: 'n' });
    $( ".map_chart_scroll" ).resizable({ handles: 'n' });
  });
  </script>
</head>
<body>
<div class="map">
<div class="slidebottom">
		<div id="expandIcon_bottom" >
			<div class="button_bottom"><img id="buttonRotation_bottom" src="images/on3.png"></div>
		</div>
		<div id="slidebottomcontent">
			<div class="secondMenu">
					<div class="searchInfo">
						<ul >
							<li class="info1">01조 5555 </li>
							<li class="info2">김큐로넷</li>
							<li class="info3">큐로넷 영업부</li>
							<li class="letterRed1">50km   </li>
							<li class="letterRed2"> 83분</li>
							<li class="search_period">조회기간 : 2013-06-30  00:00~23:50.</li>
							<li class="second_menu_selection">조회간격: 
								<select class="select" label="조회간격">
									<option value="">10초</option>
									<option value="">30초</option>
									<option value="">1분</option>
									<option value="" selected="selected">2분</option>
									<option value="">4분</option>
									<option value="">10분</option>
									<option value="">30분</option>
									
								</select>
							</li>
							
							<li class="button_search"><a href="#" style="font-weight:900;">검색</a></li>
							<li class="button_graph"><a href="#" style="font-weight:900;">그래프보기</a></li>
							<li class="button_excel"><a href="#" style="font-weight:900;">엑셀저장</a></li>
							<li><img class="up_button_inSlideBottom" src="images/up.png"></li>
						</ul>
					</div>
				</div> <!-- secondMenu end -->
				
				<div class="map_chart_scroll">
				<div class="map_chart">
					<div class="chart_head">
						<table  valign="top" cellpadding="0" cellspacing="0" > 
					
						<tr>
							<th width="40px">번호</th>
							<th width="40px">상태</th>
							<th width="40px">시동</th>
							<th width="95px">추적시간</th>
							<th width="170px">위치</th>
							<th width="40px">속도</th>
							<th width="40px">방향</th>
							<th width="110px">1일 이동거리(Km)</th>
							<th width="87px">누적거리(Km)</th>
							<th width="45px">CDMA</th>
							<th width="40px">GPS</th>
							<th width="40px">전압</th>
							<th width="40px">온도</th>
							<th width="40px">습도</th>
							<th width="*">이벤트메세지</th>
						</tr>	
					</table>
				</div><!--chart_head end-->
				<div class="chart_body">
					<table  valign="top" cellpadding="0" cellspacing="0"> 
						<tr>
							<td width="40px">3</td>
							<td width="40px">ON</td>
							<td width="40px">ON</td>
							<td width="95px">04-04 14:55:05</td>
							<td width="170px">경기도 부천시 원미구 중동 유럽 미국 일본 100m전</td>
							<td width="40px">81Km</td>
							<td width="40px">-</td>
							<td width="110px">50Km</td>
							<td width="87px">-</td>
							<td width="45px">-</td>
							<td width="40px">-</td>
							<td width="40px">0</td>
							<td width="40px">0</td>
							<td width="40px">습도</td>
							<td width="*">-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						<tr align="center" cellpadding="0" cellspacing="0">
							<td >3</td>
							<td >ON</td>
							<td >ON</td>
							<td >04-04 14:55:05</td>
							<td >경기도 부천시 원미구 중동</td>
							<td >81Km</td>
							<td >-</td>
							<td >50Km</td>
							<td >-</td>
							<td >-</td>
							<td >-</td>
							<td >0</td>
							<td >0</td>
							<td >0</td>
							<td >-</td>
						</tr>
						
						
						
					</table>	
				</div><!-- firstChart is the scroll table end -->
			</div><!-- whole chart end-->
		</div><!--scroll for whole chart end-->
			<div id="pagenation">
				<span class="current_page">1</span><img src="images/page_num_border.png">
				<span>2</span><img src="images/page_num_border.png">
				<span>3</span><img src="images/page_num_border.png">
			</div>
			
		</div><!--slidebottomcontent-->
	</div><!--slidebottom end -->
</div> 
 
</body>
</html>